<template>
  <div class="fl-model" v-if="isShow" catchtouchmove >
    <div class="model shadow" >
      <div class="code-input" v-if="isEmail">
        <div>邮箱</div>
        <input placeholder="请输入" v-model="userinfo.address">
      </div>
      <div class="code-input">
        <div>授权码</div>
        <input placeholder="请输入" v-model="userinfo.code">
      </div>
      <div class="model-button">
        <div class="button-true button-fasle" @click="close">取消</div>
        <div class="button-true" @click="handleGetExcelByCode">确定</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "enterCodeModel",
  data (){
    return {
      userinfo: {}
    }
  },
  props: {
    submitInfoList: {
      type: Object,
      default: {}
    },
    type: {
      type: String,
      default: ''
    },
    isEmail: {
      type: Boolean,
      default: true
    },
    searchWord: {
      type: String,
      default: ''
    },
    isShow: Boolean,
    code:{
      type: String,
      default: ''
    }
  },
  mounted() {
    this.handleGetStorage()
  },
  methods: {
    handleGetStorage(){
      const self = this
      wx.getStorage({
        key: 'userAddress',
        success (res) {
          self.userinfo = {}
          self.userinfo.address = res.data
        },
        fail(err){
          console.log(err)
        }
      })
    },
    handleGetExcelByCode(){
		if(!this.userinfo.code) return wx.showToast({title: '请输入授权码',icon: 'none'})
      if(this.type === 'code'){
        this.submitInfoList.code = this.userinfo.code
        this.$api.userPortalEdit(this.submitInfoList).then((res) => {
          wx.showToast({
            title: res.msg,
            icon: 'none'
          })
          if(res.code === 200){
            this.close()
            wx.redirectTo({
              url: '/pages/homePage'
            })
          }
        })
        return
      }
      const addressRule = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
      if(!this.userinfo.address || !this.userinfo.code){
        wx.showToast({
          title: '请完善信息!',
          icon: 'none'
        })
        return
      }
      if(!addressRule.test(this.userinfo.address)){
        wx.showToast({
          title: '请输入正确的邮箱格式!!',
          icon: 'none'
        })
        return;
      }
      wx.setStorage({
          key: 'userAddress',
          data: this.userinfo.address
      })
      this.$api.userPortalEmailSendRecordCreate({
        code: this.userinfo.code,
        send_email: this.userinfo.address,
        search_word:this.searchWord
      }).then(() => {
        wx.showToast({
          title: '提交成功',
        })
		this.close()
      })
    },
    //关闭窗口
    close(){
      this.$emit('isShowClose')
    }
  }
}
</script>

<style scoped lang="scss">
@keyframes show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fl-model {
  animation: show 0.5s;
  position: fixed;
  z-index: 1000;
  min-height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(0,0,0,0.7);
  .model {
    background-color: #FFFFFF;
    width: 650rpx;
    min-height: 280rpx;
    display: flex;
    border-radius: 16rpx;
    flex-direction: column;
    justify-content: space-between;
    padding: 24rpx;
    .code-input {
      width: 100%;
      padding: 28rpx;
      font-size: 40rpx;
      font-weight: 700;
      align-items: center;
      justify-content: space-between;
      display: flex;
      div {
        color: #59AC35;
      }
      input {
        margin-left: 26rpx;
        border: rgba(89,172,53,1) 2rpx solid;
        padding: 16rpx;
        height: 80rpx;
        width: 70%;
        font-size: 32rpx;
      }
    }
    .model-button {
      width: 100%;
      display: flex;
      justify-content: space-around;
      .button-true {
        width: 230rpx;
        height: 60rpx;
        display: flex;
        border-radius: 12rpx;
        background-color: #59AC35;
        color: #FFFFFF;
        font-size: 40rpx;
        justify-content: space-around;
        align-items: center;
        font-weight: 700;
      }
      .button-fasle {
        border: 2rpx #59AC35 solid;
        background-color: #FFFFFF;
        color: #59AC35;
      }
    }
  }
}

</style>
